<template>
	<view style="position: relative;">
		<view style="margin-bottom: 20rpx;">
			<swiper circular autoplay :interval="3000" :duration="500" indicator-dots style="height: 320px;"
				indicator-color="rgba(255, 255, 255, 0.6)" indicator-active-color="#006eff">
				<swiper-item v-for="item in medicineData.medicinesStyleList" :key="item">
					<image :src="item.stylePhoto" alt="" style="width: 100%; height: 320px;" />
				</swiper-item>
			</swiper>
			<!-- 商品信息 -->
			<view class="box" style="padding: 10px;margin-top: 10px;">
				<span style="font-size: 18px;font-weight: bold;">{{medicineData.name}}</span>
				<view style="margin-top: 15px;align-items: center;">
					<view style="display: flex;gap: 10px;">
						<image src="../../static/icons/小货车.png" style="width: 40rpx;margin-left: 2px;margin-top: 2px"
							mode="widthFix">
							<view>
								<span>承诺24小时发货，现在下单，预计{{getThreeDaysLaterMonthAndDay()}}送达</span><br>
								<span>发货地:湖南长沙 快递:免运费</span>
							</view>
					</view>
					<view style="display: flex;gap: 10px;margin-top: 15px;align-items: center;">
						<image src="../../static/icons/爱心.png" style="width: 40rpx;margin-left: 2px;margin-top: 2px"
							mode="widthFix">
							<span>假一赔四 退货宝 极速退款 7天无理由退换</span>
							<image src="../../static/icons/问号.png" style="width: 40rpx;margin-left: 2px;margin-top: 2px"
								mode="widthFix" @click="toggle('bottom')">
					</view>
					<view style="display: flex;gap: 10px;margin-top: 15px;align-items: center;">
						<image src="../../static/icons/批准文号.png" style="width: 40rpx;margin-left: 2px;margin-top: 2px"
							mode="widthFix">
							<span> 型号 批准文号 药物规格 生成企业 销售商家 </span>
							<image src="../../static/icons/问号.png" style="width: 40rpx;margin-left: 2px;margin-top: 2px"
								mode="widthFix" @click="toggle2('bottom')">
					</view>
				</view>
			</view>
			<!--店铺 -->
			<view class="box" style="margin-top: 10px;">
				<view style="display: flex;">
					<image :src="medicineData.businessAvatar" style="width: 60px;height: 50px;"></image>
					<view>
						<view style="display: flex;">
							<view style="font-size: 16px;font-weight: bold;margin-left: 10px;margin-top: 2px;">
								{{medicineData.businessName}}
							</view>
							<image src="../../static/icons/粉丝.png"
								style="width: 40rpx;margin-left: 10px;margin-top: 2px" mode="widthFix">
								<view style="margin-left: 2px;margin-top: 2px;">{{medicineData.businessCollect}}
								</view>
						</view>
						<view style="display: flex;margin-left: 8px;margin-top: 3px;">
							<uni-rate allow-half :value="medicineData.businessStar" @change="onRatingChange"
								readonly="true" />
						</view>
					</view>
					<view style="margin-left: 20px;">
						<view style="margin-bottom: 4px;">
							<button style="line-height: 10px;display: flex;text-align: center;align-items: center;"
								@click="BusinessCollect">
								<image v-if='!collectBusiness' src="../../static/icons/收藏.png"
									style="width: 45rpx;margin-left: 10px;margin-top: 2px" mode="widthFix">
									<image v-else src="../../static/icons/已收藏.png"
										style="width: 45rpx;margin-left: 10px;margin-top: 2px" mode="widthFix">
										<view style="font-size: 13px;font-weight: bold;">收藏店铺</view>
							</button>
						</view>
						<view style="margin-bottom: 4px;">
							<button style="line-height: 10px;display: flex;text-align: center;align-items: center;"
								@click="goBusinessDetail(medicineData.businessId)">
								<image src="../../static/icons/去逛逛.png"
									style="width: 40rpx;margin-left: 10px;margin-top: 2px" mode="widthFix">
									<view style="font-size: 13px;font-weight: bold;">进铺看看</view>
							</button>
						</view>
					</view>
				</view>
			</view>
			<!-- 用户评价 -->
			<view style="padding: 10px;margin-top: 10px;" class="box">
				<view style="display: flex;">
					<view style="flex: 2;">
						<span style="font-size: 20px;font-weight: bold;">用户评价</span>
						<span>({{userCommentData.length}})</span>
					</view>
					<view style="flex: 1;margin-top: 8px;margin-left: 120px;">
						<span @click="dialogToggle">查看全部</span>
						<span>></span>
					</view>
				</view>
				<view style="padding: 10px;display: flex;">
					<view>
						<view v-for="item in userCommentData" style="margin-top: 15px;">
							<view style="display: flex;">
								<view style="width: 40px;">
									<image :src="item.userList[0].avatar"
										style="height: 40px; width: 40px; border-radius: 50%"></image>
								</view>
								<view style="width: 200px; margin-left: 10px;">
									<view style="display: flex;">
										<view style="font-weight: 700; font-size: 17px; color: #000000FF;">
											{{item.userList[0].name}}
										</view>
										<uni-rate :value="item.star" style="margin-left: 10px;" readonly="true" />
									</view>
									<view style="display: flex;color: #7A7A7AFF;width: 1000px;">
										<span>{{item.time}}</span>
										<span style="margin-left: 10px;">{{item.title}}</span>
									</view>

								</view>
							</view>
							<view style="margin-top: 10px; font-size: 16px;">
								{{item.content}}
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 药物详情 -->
			<view style="padding: 10px;margin-top: 10px;height: 500px;" class="box">
				<view style="display: flex;">
					<view style="flex: 2;">
						<span style="font-size: 20px;font-weight: bold;">药物详情</span>
						<view class="rich-text-container">
							<rich-text :nodes="medicineData.detailsPhoto"></rich-text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 购物栏 -->
		<view style="position: fixed;bottom: 0;" class="goods-carts">
			<uni-goods-nav :options="options" :fill="true" :button-group="buttonGroup" @click="onClick"
				@buttonClick="buttonClick" />
		</view>
		<view style="position: fixed; top: 50px; right: 10px; z-index: 1000;">
			<view style="display: flex;">
				<view style="border-radius: 50%;background-color: #EDF4FF;width: 50rpx;">
					<image v-if='!collectMedicines' src="../../static/icons/爱心.png"
						style="width: 40rpx;margin-left: 2px;margin-top: 2px" mode="widthFix" @click="MedicinesCollect">
						<image v-else src="../../static/icons/已爱心.png"
							style="width: 40rpx;margin-left: 2px;margin-top: 2px" mode="widthFix"
							@click="MedicinesCollect">
				</view>
				<view style="border-radius: 50%;background-color: #EDF4FF;width: 50rpx;margin-left: 10px;">
					<image src="../../static/icons/分享.png" style="width: 35rpx;margin-left: 4px;margin-top: 4px"
						mode="widthFix" @click="shareToggle">
				</view>
			</view>
		</view>
		<view>
			<!-- 分享弹窗 -->
			<uni-popup ref="share" type="share" safeArea backgroundColor="#fff">
				<uni-popup-share @click="toShow()"></uni-popup-share>
			</uni-popup>
		</view>
		<view>
			<!-- 保障弹窗 -->
			<uni-popup ref="popup" background-color="#fff" @change="change">
				<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
					<view style="margin-bottom: 10px;padding: 10px;">
						<view style="font-size: 15px;font-weight: bold;">假一赔四</view>
						<view style="margin-top: 10px;">如果消费者购买的商品被证实为假货，商家不仅要全额退款，还需要按照商品原价的四倍对消费者进行赔偿</view>
					</view>
					<view style="margin-bottom: 10px;padding: 10px;">
						<view style="font-size: 15px;font-weight: bold;">退货宝</view>
						<view style="margin-top: 10px;">退货运费险保障：选择上门取件，自动减免首重运费；若选择自寄，参照首重标准补偿，具体以“订单详情-退货宝”为准</view>
					</view>
					<view style="margin-bottom: 10px;padding: 10px;">
						<view style="font-size: 15px;font-weight: bold;">极速退款</view>
						<view style="margin-top: 10px;">满足相应条件时，信誉良好的用户在退货寄出后，享受极速退款到账。</view>
					</view>
					<view style="margin-bottom: 10px;padding: 10px;">
						<view style="font-size: 15px;font-weight: bold;">7天无理由退货</view>
						<view style="margin-top: 10px;">满足相应条件（密封包装拆封后不支持）时，消费者可申请“7天无理由退换货”</view>
					</view>
					<button type="warn" @click="closetoggle">我知道了</button>
				</view>
			</uni-popup>
		</view>
		<view>
			<!--参数弹窗 -->
			<uni-popup ref="popup2" background-color="#fff" @change="change">
				<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
					<scroll-view scroll-y="true" style="height: 400px;">
						<view style="margin: 20px;">
							<view style="font-size: 15px;font-weight: bold;text-align: center;margin-bottom: 20px;">产品参数
							</view>
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">药物型号</view>
								<view style="flex: 2;">{{medicineData.dosageForm }}</view>
							</view>
							<view class="divider"></view>
						</view>
						<view style="margin: 20px;">
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">药物分类</view>
								<view style="flex: 2;">{{medicineData.typeName }}</view>
							</view>
							<view class="divider"></view>
						</view>
						<view style="margin: 20px;">
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">销售商家</view>
								<view style="flex: 2;">{{medicineData.businessName}}</view>
							</view>
							<view class="divider"></view>
						</view>
						<view style="margin: 20px;">
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">产地</view>
								<view style="flex: 2;">{{medicineData.deliver}}</view>
							</view>
							<view class="divider"></view>
						</view>
						<view style="margin: 20px;">
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">生成企业</view>
								<view style="flex: 2;">{{medicineData.manufacturing}}</view>
							</view>
							<view class="divider"></view>
						</view>
						<view style="margin: 20px;">
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">上市许可人</view>
								<view style="flex: 2;">{{medicineData.listedHead }}</view>
							</view>
							<view class="divider"></view>
						</view>
						<view style="margin: 20px;">
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">药物规格</view>
								<view style="flex: 2;">{{medicineData.medicinesStyleList[0].styleDescribe }}
									{{medicineData.medicinesStyleList[1].styleDescribe }}
									{{medicineData.medicinesStyleList[2].styleDescribe }}
									{{medicineData.medicinesStyleList[3].styleDescribe }}
								</view>
							</view>
							<view class="divider"></view>
						</view>
						<view style="margin: 20px;">
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">批准文号</view>
								<view style="flex: 2;">{{medicineData.approvalSymbol}}</view>
							</view>
							<view class="divider"></view>
						</view>
						<view style="margin: 20px;">
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">适用人群</view>
								<view style="flex: 2;">不限 儿童 老年 成人</view>
							</view>
							<view class="divider"></view>
						</view>
						<view style="margin: 20px;">
							<view style="margin-top: 10px;display: flex;">
								<view style="font-weight: bold;flex: 1;">保质期</view>
								<view style="flex: 2;">18个月</view>
							</view>
							<view class="divider"></view>
						</view>
					</scroll-view>
					<button type="warn" @click="closetoggle2">我知道了</button>
				</view>
			</uni-popup>
		</view>
		<view>
			<!-- 购物弹窗 -->
			<uni-popup ref="popup3" background-color="#fff" @change="change">
				<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
					<scroll-view scroll-y="true" style="height: 400px;position: relative;">
						<view style="padding: 20px;">
							<view style="display: flex;">
								<image src="../../static/icons/地址管理.png"
									style="width: 40rpx;margin-left: 2px;margin-top: 2px" mode="widthFix">
									<view style="margin-left: 2px;">
										<view style="display: flex;gap: 10px;">
											<view>{{defutAddress.username}}</view>
											<view>{{defutAddress.address}}</view>
										</view>
										<view
											style="width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
											快递 包邮 承诺24小时内发货，预计{{getThreeDaysLaterMonthAndDay()}}送达</view>
									</view>
									<view @click="toggle4('bottom')"
										style="margin-left: 10px;font-size: 16px;font-weight: bold;margin-top: 8px;">
										>
									</view>
							</view>
							<view class="divider"></view>
							<view style="display: flex;margin-top: 10px;" class="box">
								<image :src="medicineData.photo" style="width: 100rpx;" mode="widthFix">
								</image>
								<view style="margin-left: 10px;">
									<view style="display: flex;">
										<view style="display: flex; color: red;">
											<view style="margin-top: 2px;margin-left: 10px;font-weight: bold">应付</view>
											<view style="margin-top: 10rpx;">￥</view>
											<text style="font-size: 18px; margin-right: 10rpx;">{{this.price}}</text>
											<view style="display: flex;margin-top: 2px;">
												<view>|</view>
												<view style="font-weight: bold;margin-left: 4px;">共实付￥{{this.total}}
												</view>
											</view>
										</view>
									</view>
									<view style="margin-left: 5px;display: flex;">
										<uni-number-box :value="num" @change="changeValue" />
										<view style="margin-left: 5px;">货源充足</view>
									</view>
								</view>
							</view>
							<view style="margin-top: 20px;" class="box">
								<view style="font-size: 16px;font-weight: bold;margin-bottom: 5px;">药物规格(4)</view>
								<view v-for="(medicinesStyle, index) in medicineData.medicinesStyleList" :key="index"
									style="margin-top: 10px;">
									<button @click="changePrice(medicinesStyle, index)"
										:class="{ 'is-active': selectedButtonIndex === index }"
										style="line-height: 40px;">
										{{medicinesStyle.styleDescribe }}
									</button>
								</view>
							</view>
							<view style="margin-top: 10px;height: 200px;" class="box">
								<radio-group name="sex">
									<view style="margin-top: 10px;">
										<view style="display: flex;margin-top: 5px;">
											<image src="../../static/icons/支付宝.png"
												style="width: 50rpx;margin-left: 2px;" mode="widthFix" />
											<view
												style="flex: 10; margin-left: 10px;font-size: 16px;font-weight: bold;">
												支付宝</view>
											<radio style="flex: 1;" @click="changPay('支付宝')" />
										</view>
										<view style="display: flex;margin-top: 20px;">
											<image src="../../static/icons/微信.png"
												style="width: 50rpx;margin-left: 2px;" mode="widthFix" />
											<view
												style="flex: 10; margin-left: 10px;font-size: 16px;font-weight: bold;">
												微信支付</view>
											<radio style="flex: 1;" @click="changPay('支付宝')" />
										</view>
										<view style="display: flex;margin-top: 20px;">
											<image src="../../static/icons/余额宝.png"
												style="width: 50rpx;margin-left: 2px;" mode="widthFix" />
											<view
												style="flex: 10; margin-left: 10px;font-size: 16px;font-weight: bold;">
												余额支付</view>
											<radio style="flex: 1;" @click="changPay('余额')" checked="true" />
										</view>
									</view>
								</radio-group>
							</view>
						</view>
					</scroll-view>
					<view style="position: fixed;top: 2px;right: 4px;" @click="closetoggle3">
						<image src="../../static/icons/叉.png" style="width: 30rpx;margin-left: 2px;" mode="widthFix">
					</view>
					<view style="position: fixed; display: flex; bottom: 0; width: 100%; height: 50px; ">
						<button style="flex: 1; border: none; background-color: #ffcc00;font-size: 16px;"
							@click='addCart()'>
							加入购物车
						</button>
						<button @click="pay"
							style="flex: 1; border: none; background-color: #ff4444; color: white; font-size: 16px;">
							立即支付
						</button>
					</view>
				</view>
			</uni-popup>
		</view>
		<view>
			<!-- 地址弹窗 -->
			<uni-popup ref="popup4" background-color="#fff" @change="change">
				<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
					<scroll-view scroll-y="true" style="height: 400px; position: relative;">
						<view style="padding: 20px;" class="box">
							<view style="text-align: center; font-weight: bold; font-size: 16px;">地址和配送服务</view>
							<view style="display: flex;">
								<view style="font-weight: bold; font-size: 14px;">常用地址</view>
								<image src="../../static/icons/添加.png"
									style="width: 30rpx; margin-left: 180px; margin-top: 3px;" mode="widthFix">
									<view style="color: #FF8040; font-weight: bold;" @click="goAddress()">管理和添加地址</view>
							</view>
							<view style="margin-top: 10px;" v-for="(address, index) in addressData" :key="index">
								<button @click="changeAddress(address, index)"
									:class="{ 'is-active': selectedButtonIndex2 === index }">
									<view style="text-align: start; display: flex;">
										<view style="flex: 10;">
											<view style="font-size: 14px; color: #808080; line-height: 20px;">
												{{address.address}}
											</view>
											<view
												style="font-size: 13px; color: black; line-height: 20px; font-weight: bold;">
												{{address.door}}
											</view>
											<view style="font-size: 12px; line-height: 20px;">{{address.username}}
												{{address.phone}}
											</view>
										</view>
										<view style="flex: 1;">
											<image src="../../static/icons/编辑.png"
												style="width: 30rpx; margin-top: 5px;" mode="widthFix">
										</view>
									</view>
								</button>
							</view>
						</view>
						<view style="padding: 20px;margin-top: 10px;height: 200px;" class="box">
							<view style="font-size: 16px;font-weight: bold;">配送服务</view>
							<view style="display: flex;margin-top: 10px;">
								<view style="flex: 3;color: black;">普通配送</view>
								<view style="display: flex;flex: 1;color: black;">
									<view>快递 包邮</view>
								</view>
								<view>
									<image src="../../static/icons/对.png" style="width: 30rpx; margin-top: 2px;"
										mode="widthFix">
								</view>
							</view>
							<view style="display: flex;margin-top: 10px;">
								<view style="flex: 3;color: black;">退货宝</view>
								<view style="display: flex;flex: 1;color: black;">
									<view>免费</view>
								</view>
								<view>
									<image src="../../static/icons/对.png" style="width: 30rpx; margin-top: 2px;"
										mode="widthFix">
								</view>
							</view>
							<view style="display: flex;">
								<view style="margin-top: 10px;display: flex;">
									<view style="color: black;">号码保护</view>
									<view style="margin-left: 4px; color: #808080;">
										<view>隐藏收件人真实手机号，保护隐私</view>
									</view>
								</view>
								<view style="margin-top: 4px;padding-right: 0;">
									<switch color="#FF8040" style="transform:scale(0.6);margin-left: 20px;" />
								</view>
							</view>
						</view>
					</scroll-view>
				</view>
				<view style="position: fixed; top: 2px; right: 4px;" @click="closetoggle4">
					<image src="../../static/icons/叉.png" style="width: 30rpx; margin-left: 2px;" mode="widthFix">
				</view>
				<view style="position: fixed; display: flex; bottom: 0; width: 100%; height: 50px;"
					@click="closetoggle4">
					<button style="flex: 1; border: none; background-color: #ff4444; color: white; font-size: 16px;">
						确定
					</button>
				</view>
			</uni-popup>
		</view>
		<view>
			<!-- 提示窗示例 -->
			<uni-popup ref="alertDialog" type="dialog">
				<uni-popup-dialog :type="msgType" cancelText="关闭" confirmText="我知道了" title="通知" content="测试数据,暂无更多信息"
					@confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user: uni.getStorageSync('xm-user'),
				form: "",
				type: "bottom",
				payType: '余额支付', //默认值
				range: [{
						"value": '支付宝',
						"text": "支付宝"
					},
					{
						"value": '微信支付',
						"text": "微信支付"
					},
					{
						"value": '余额支付',
						"text": "余额支付"
					},
				],
				options: [{
					icon: 'chat',
					text: '客服'
				}, {
					icon: 'shop',
					text: '店铺',
					infoBackgroundColor: '#007aff',
					infoColor: "#f5f5f5"
				}, {
					icon: 'cart',
					text: '购物车',
					info: 0
				}],
				buttonGroup: [{
						text: '加入购物车',
						backgroundColor: 'linear-gradient(90deg, #FFCD1E, #FF8A18)',
						color: '#fff'
					},
					{
						text: '立即购买',
						backgroundColor: 'linear-gradient(90deg, #FE6035, #EF1224)',
						color: '#fff'
					}
				],
				addressId: 0,
				defutAddress: {},
				addressData: {},
				medicinesId: 0,
				businessId: '',
				medicineData: {},
				rateText: '3.5', // 初始文本
				rateValue: 3.5, // 初始评分值
				price: '',
				total: '',
				selectedButtonIndex: 0,
				selectedButtonIndex2: null,
				num: 1,
				collectMedicines: false,
				collectBusiness: false,
				userCommentData: {},
				address: {},
				medicinesName:'',

			}
		},
		onLoad(option) {
			this.medicinesId = parseInt(option.medicinesId); // 转换为整数
			this.getSystemInfo();
		},
		onShow() {
			this.loadMedicinesCollect();
			this.loadMedicines();
			this.loadDefutAddress()
			this.loadUserComment()
			this.loadAddress()
		},
		methods: {
			chat(chatId) {
				// 发送第一个请求以获取 chatRoleId1 和 chatRoleId2
				this.$request.post('/chatRole/add', {
					businessId: chatId,
					userId: this.user.id
				}).then(res => {
					if (res.code === '200') {
						// 获取返回的 mapData
						const resultMap = res.data; // resultMap 应该包含 chatRoleId1 和 chatRoleId2
						// 从 resultMap 中提取 ID
						const chatRoleId1 = resultMap.chatRoleId1;
						const chatRoleId2 = resultMap.chatRoleId2;
						// 使用提取的 ID 发送第二个请求
						this.$request.post('/chatGroup/add', {
							chatUserId: chatRoleId1,
							userId: chatRoleId2
						}).then(res => {
							if (res.code === '200') {
								// 请求成功，跳转到聊天页面
								this.$router.push({
									path: '/pages/chatDetail/chatDetail',
									query: {
										chatId: chatId,
										role: 'BUSINESS'
									}
								});
							} else {
								// 显示错误信息
								this.$message.error(res.msg);
							}
						});
					} else {
						// 显示错误信息
						this.$message.error(res.msg);
					}
				});
			},
			toShow() {
				uni.showToast({
					icon: 'error',
					title: '该功能还未开发'
				})
			},
			changPay(type) {
				this.payType = type
				// 这里可以添加逻辑来处理不同的支付方式
			},
			pay() {
				if (this.payType === '支付宝' || this.payType === '微信') {
					uni.showToast({
						icon: 'error',
						title: '该功能还未开发'
					})
					return
				}
				let data = {
					num: this.num,
					medicinesId: this.medicinesId,
					price: this.price,
					businessId: this.businessId,
					medicinesStyleId: this.medicinesStyleId,
					addressId: this.addressId,
					status: '待发货',
					medicinesName:this.medicinesName
				}
				this.$request.post('/order/pay', data).then(res => {
					if (res.code === '200') {
						uni.showToast({
							icon: 'success',
							title: '下单成功'
						})
					} else {
						uni.showToast({
							icon: 'error',
							title: res.msg
						})
					}
				})
			},
			addCart() {
				let data = {
					num: this.num,
					totalPrice: this.total,
					businessId: this.businessId,
					medicinesStyleId: this.medicinesStyleId,
					medicinesId: this.medicinesId,
				}
				this.$request.post('/cart/add', data).then(res => {
					if (res.code === '200') {
						uni.showToast({
							icon: 'success',
							title: '加入成功'
						})
					} else {
						this.$message.error(res.msg)
					}
				})
			},
			loadAddress() {
				this.$request.get('/address/selectAll/').then(res => {
					if (res.code === '200') {
						// 按销量从高到低排序
						this.addressData = res.data;
					} else {
						this.$message.error(res.msg);
					}
				});
			},
			dialogToggle(type) {
				this.msgType = type
				this.$refs.alertDialog.open()
			},
			goBusinessDetail(businessId) {
				uni.navigateTo({
					url: '/pages/businessDetail/businessDetail?businessId=' + businessId
				})
			},
			goCart() {
				uni.navigateTo({
					url: '/pages/Cart/Cart'
				})
			},
			loadDefutAddress() {
				this.$request.get('/address/selectDefaut').then(res => {
					if (res.code === '200') {
						// 按销量从高到低排序
						this.defutAddress = res.data;
						this.addressId = res.data.id;
					} else {
						this.$message.error(res.msg);
					}
				});
			},
			loadUserComment() {
				this.$request.get(`/userComment/selectByFid/${this.medicinesId}/${encodeURIComponent('MEDICINES')}`).then(
					res => {
						if (res.code === '200') {
							// 按销量从高到低排序
							this.userCommentData = res.data;
						} else {
							this.$message.error(res.msg);
						}
					});
			},
			MedicinesCollect() {
				let data = {
					userId: this.user.id,
					fid: this.medicinesId,
					module: 'MEDICINES'
				};
				this.collectMedicines = !this.collectMedicines;
				this.$request.post('/collect/save', data).then(res => {
					if (res.code === '200') {
						uni.showToast({
							icon: 'success',
							title: '收藏成功'
						})
					} else {
						uni.showToast({
							icon: 'error',
							title: res.msg
						})
					}
				})
			},
			loadMedicinesCollect() {
				this.$request.get(
					`/collect/selectByUserId/${this.user.id}/${this.medicinesId}/${encodeURIComponent('MEDICINES')}`
				).then(res => {
					if (res.data !== null) {
						this.collectMedicines = true;
					}
				}).catch(error => {
					console.error('收藏请求失败:', error);
					this.$message.error('收藏请求失败，请稍后再试');
				});
			},
			loadBusinessCollect() {
				this.$request.get(
						`/collect/selectByUserId/${this.user.id}/${this.businessId}/${encodeURIComponent('BUSINESS')}`)
					.then(res => {
						if (res.data !== null) {
							this.collectBusiness = true;
						}
					});
			},
			BusinessCollect() {
				let data = {
					userId: this.user.id,
					fid: this.businessId,
					module: 'BUSINESS'
				};
				this.collectBusiness = !this.collectBusiness;
				this.$request.post('/collect/save', data).then(res => {
					if (res.code === '200') {
						uni.showToast({
							icon: 'success',
							title: '收藏成功'
						})
					} else {
						uni.showToast({
							icon: 'error',
							title: res.msg
						})
					}
				})
			},
			getThreeDaysLaterMonthAndDay() {
				// 获取当前日期
				const currentDate = new Date();

				// 设置日期为3天后
				currentDate.setDate(currentDate.getDate() + 3);

				// 获取3天后的月份（注意：月份是从0开始的，所以需要加1）
				const month = currentDate.getMonth() + 1;

				// 获取3天后的日期
				const day = currentDate.getDate();

				// 返回格式化的月和日
				return `${month}月${day}日`;
			},
			loadMedicines() {
				this.$request.get(`/medicines/selectDetailById/${this.medicinesId}`).then(res => {
					if (res.code === '200') {
						// 按销量从高到低排序
						this.medicineData = res.data;
						this.price = this.medicineData.medicinesStyleList[0].price
						this.total = this.medicineData.medicinesStyleList[0].price
						this.businessId = this.medicineData.businessId
						this.medicinesName=this.medicineData.name
						this.medicinesStyleId = this.medicineData.medicinesStyleList[0].id
						this.loadBusinessCollect()
					} else {
						this.$message.error(res.msg);
					}
				});
			},
			goAddress() {
				uni.navigateTo({
					url: '/pages/address/address'
				})
			},
			changePrice(medicinesStyle, index) {
				this.price = medicinesStyle.price
				this.total = this.price * this.num
				this.selectedButtonIndex = index
				console.log(index)
				// this.total = this.price * this.num
			},
			changeAddress(address, index) {
				this.selectedButtonIndex2 = index
				console.log(index)
				this.defutAddress = address
				this.addressId = address.id
			},
			changeValue(value) {
				this.num = value
				this.total = value * this.price
				console.log(value)
			},
			shareToggle() {
				this.$refs.share.open()
			},
			toggle(type) {
				this.type = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup.open(type)
			},
			toggle2(type) {
				this.type = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup2.open(type)
			},
			toggle3(type) {
				this.type = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup3.open(type)
			},
			toggle4(type) {
				this.type = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup4.open(type)
			},
			closetoggle4() {
				this.$refs.popup4.close()
			},
			closetoggle() {
				this.$refs.popup.close()
			},
			closetoggle2() {
				this.$refs.popup2.close()
			},
			closetoggle3() {
				this.$refs.popup3.close()
			},
			onClick(e) {
				// e.index 是点击的选项索引
				switch (e.index) {
					case 0:
						this.chat(this.businessId);
						break;
					case 1:
						this.goBusinessDetail(this.businessId);
						break;
					case 2:
						this.goCart();
						break;
				}
			},
			buttonClick(e) {
				// e.index 是点击的按钮索引
				switch (e.index) {
					case 0:
						this.addCart();
						break;
					case 1:
						this.buyNow();
						break;
				}
			},
			showCustomerService() {
				// 展示客服信息的逻辑
				console.log('客服被点击');
			},
			showShop() {
				// 展示店铺信息的逻辑
				console.log('店铺被点击');
			},
			showCart() {
				// 展示购物车的逻辑
				console.log('购物车被点击');
			},
			addToCart() {
				// 加入购物车的逻辑
				console.log('加入购物车被点击');
				this.options[2].info++;
			},
			buyNow() {
				// 立即购买的逻辑
				console.log('立即购买被点击');
				this.toggle3(this.type)
			}
		}
	}
</script>

<style>
	.rich-text-container {
		transform-origin: top left;
		/* 控制缩放的基点 */
	}

	.goods-carts {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		position: fixed;
		left: 0;
		right: 0;
		/* #ifdef H5 */
		left: var(--window-left);
		right: var(--window-right);
		/* #endif */
		bottom: 0;
	}

	.is-active {
		background-color: #FFF7F3;
		/* 选中状态的背景颜色示例 */
		color: #FF5000;
		/* 文本颜色 */
		border-color: #FF5000;
		/* 边框颜色 */
	}
</style>